
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>ghz - Greeter SayHello</title>
    <script src="https://d3js.org/d3.v5.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/papaparse@4.5.0/papaparse.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/britecharts@3/dist/bundled/britecharts.min.js"></script>
    
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/britecharts@3/dist/css/britecharts.min.css" type="text/css" /></head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css" />

  </head>
	
	<body>
	
		<section class="section">

		<div class="container">
			
			<h1 class="title">Greeter SayHello</h1>
			
			
				<h2 class="subtitle">Wed Jan 23 2019 @ 20:08:58</h2>
			
		</div>
		<br />
		
		<div class="container">
      <nav class="breadcrumb has-bullet-separator" aria-label="breadcrumbs">
        <ul>
          <li>
            <a href="#summary">
              <span class="icon is-small">
                <i class="fas fa-clipboard-list" aria-hidden="true"></i>
              </span>
              <span>Summary</span>
            </a>
          </li>
          <li>
            <a href="#histogram">
              <span class="icon is-small">
                <i class="fas fa-chart-bar" aria-hidden="true"></i>
              </span>
              <span>Histogram</span>
            </a>
          </li>
          <li>
            <a href="#latency">
              <span class="icon is-small">
                <i class="far fa-clock" aria-hidden="true"></i>
              </span>
              <span>Latency Distribution</span>
            </a>
          </li>
          <li>
            <a href="#status">
              <span class="icon is-small">
                <i class="far fa-check-square" aria-hidden="true"></i>
              </span>
              <span>Status Distribution</span>
            </a>
					</li>
					
          <li>
            <a href="#errors">
              <span class="icon is-small">
                <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
              </span>
              <span>Errors</span>
            </a>
					</li>
					
          <li>
            <a href="#data">
              <span class="icon is-small">
                <i class="far fa-file-alt" aria-hidden="true"></i>
              </span>
              <span>Data</span>
            </a>
          </li>
        </ul>
      </nav>
      <hr />
		</div>
		
		

			<div class="container">
				<div class="field is-grouped">

				
					
					<div class="control">
						<div class="tags has-addons">
							<span class="tag is-dark">created by</span>
							<span class="tag is-primary">Joe Developer</span>
						</div>
					</div>

				
					
					<div class="control">
						<div class="tags has-addons">
							<span class="tag is-dark">env</span>
							<span class="tag is-primary">staging</span>
						</div>
					</div>

				

				</div>
			</div>
			<br />
		
	  
	  <div class="container">
			<div class="columns">
				<div class="column is-narrow">
					<div class="content">
						<a name="summary">
							<h3>Summary</h3>
						</a>
						<table class="table">
							<tbody>
								<tr>
									<th>Count</th>
									<td>200</td>
								</tr>
								<tr>
									<th>Total</th>
									<td>212.87 ms</td>
								</tr>
								<tr>
									<th>Slowest</th>
								<td>69.05 ms</td>
								</tr>
								<tr>
									<th>Fastest</th>
									<td>25.88 ms</td>
								</tr>
								<tr>
									<th>Average</th>
									<td>37.82 ms</td>
								</tr>
								<tr>
									<th>Requests / sec</th>
									<td>939.53</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<div class="column">
					<div class="content">
						<span class="title is-5">
							<strong>Options</strong>
						</span>
						<article class="message">
  						<div class="message-body">
								<pre style="background-color: transparent;">{
  "call": "helloworld.Greeter.SayHello",
  "proto": "../../testdata/greeter.proto",
  "host": "0.0.0.0:50051",
  "n": 200,
  "c": 50,
  "timeout": 20000000000,
  "dialTimeout": 10000000000,
  "data": {
    "name": "Bob Smith"
  },
  "binary": false,
  "insecure": true,
  "CPUs": 8,
  "name": "Greeter SayHello"
}</pre>
							</div>
						</article>
					</div>
				</div>
			</div>
	  </div>

	  <br />
		<div class="container">
			<div class="content">
				<a name="histogram">
					<h3>Histogram</h3>
				</a>
				<p>
					<div class="js-bar-container"></div>
				</p>
			</div>
	  </div>

	  <br />
		<div class="container">
			<div class="content">
				<a name="latency">
					<h3>Latency distribution</h3>
				</a>
				<table class="table is-fullwidth">
					<thead>
						<tr>
							
								<th>10 %</th>
							
								<th>25 %</th>
							
								<th>50 %</th>
							
								<th>75 %</th>
							
								<th>90 %</th>
							
								<th>95 %</th>
							
								<th>99 %</th>
							
						</tr>
					</thead>
					<tbody>
						<tr>
							
								<td>28.62 ms</td>
							
								<td>31.81 ms</td>
							
								<td>36.73 ms</td>
							
								<td>41.76 ms</td>
							
								<td>45.50 ms</td>
							
								<td>64.08 ms</td>
							
								<td>69.05 ms</td>
							
						</tr>
					</tbody>
				</table>
			</div>
		</div>

		<br />
		<div class="container">
			<div class="columns">
				<div class="column is-narrow">
					<div class="content">
						<a name="status">
							<h3>Status distribution</h3>
						</a>
						<table class="table is-hoverable">
							<thead>
								<tr>
									<th>Status</th>
									<th>Count</th>
									<th>% of Total</th>
								</tr>
							</thead>
							<tbody>
							  
									<tr>
									  <td>Internal</td>
										<td>1</td>
										<td>0.50 %</td>
									</tr>
									
									<tr>
									  <td>OK</td>
										<td>198</td>
										<td>99.00 %</td>
									</tr>
									
									<tr>
									  <td>PermissionDenied</td>
										<td>1</td>
										<td>0.50 %</td>
									</tr>
									
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
			
			
				
				<br />
				<div class="container">
					<div class="columns">
						<div class="column is-narrow">
							<div class="content">
								<a name="errors">
									<h3>Errors</h3>
								</a>
								<table class="table is-hoverable">
									<thead>
										<tr>
											<th>Error</th>
											<th>Count</th>
											<th>% of Total</th>
										</tr>
									</thead>
									<tbody>
										
											<tr>
												<td>rpc error: code = Internal desc = Internal error.</td>
												<td>1</td>
												<td>0.50 %</td>
											</tr>
											
											<tr>
												<td>rpc error: code = PermissionDenied desc = Permission denied.</td>
												<td>1</td>
												<td>0.50 %</td>
											</tr>
											
										</tbody>
									</table>
								</div>
							</div>
						</div>
					</div>

			

			<br />
      <div class="container">
        <div class="columns">
          <div class="column is-narrow">
            <div class="content">
              <a name="data">
                <h3>Data</h3>
              </a>
              
              <a class="button" id="dlJSON">JSON</a>
              <a class="button" id="dlCSV">CSV</a>
            </div>
          </div>
        </div>
			</div>
			
			<div class="container">
        <hr />
        <div class="content has-text-centered">
          <p>
            Generated by <strong>ghz</strong>
          </p>
          <a href="https://github.com/bojand/ghz"><i class="icon is-medium fab fa-github"></i></a>
        </div>
      </div>
		
		</section>

  </body>

  <script>

	const count = 200;

	const rawData = [{"timestamp":"2019-01-23T20:08:58.003858-04:00","latency":31139731,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.00386-04:00","latency":30855455,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.003952-04:00","latency":30945921,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.003954-04:00","latency":31234671,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.003955-04:00","latency":31145868,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.003955-04:00","latency":31132206,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.003956-04:00","latency":31215544,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.003982-04:00","latency":30903806,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.004027-04:00","latency":31677525,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.004245-04:00","latency":31869122,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.004429-04:00","latency":31920512,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.00515-04:00","latency":32274352,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.006731-04:00","latency":33776088,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.006732-04:00","latency":33699439,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.007123-04:00","latency":34153531,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.008688-04:00","latency":35862054,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.008701-04:00","latency":35954672,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.008703-04:00","latency":36067355,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.009113-04:00","latency":36337939,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.009114-04:00","latency":36022145,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.009373-04:00","latency":37085661,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.00946-04:00","latency":36906608,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.009461-04:00","latency":36807065,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.011038-04:00","latency":38029073,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.011124-04:00","latency":38176233,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.011125-04:00","latency":38154355,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.011426-04:00","latency":39027350,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.011427-04:00","latency":38856272,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.012035-04:00","latency":39815932,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.012273-04:00","latency":39759143,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.013885-04:00","latency":40722335,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.013886-04:00","latency":40719312,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.013893-04:00","latency":40840110,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.013902-04:00","latency":41139393,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.013903-04:00","latency":40582482,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.013904-04:00","latency":40730976,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.014652-04:00","latency":42184110,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.014653-04:00","latency":41744674,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.014721-04:00","latency":41875028,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.014723-04:00","latency":42193275,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.015384-04:00","latency":43118015,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036683-04:00","latency":63756716,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036683-04:00","latency":64139417,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036683-04:00","latency":64079130,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036684-04:00","latency":63941618,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036684-04:00","latency":63962311,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036728-04:00","latency":64007941,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036747-04:00","latency":64149161,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036793-04:00","latency":64162579,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036912-04:00","latency":32775229,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036913-04:00","latency":32770664,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036913-04:00","latency":30100517,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036913-04:00","latency":31627288,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036947-04:00","latency":32963597,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.036967-04:00","latency":32874540,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038817-04:00","latency":34823754,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038818-04:00","latency":65882913,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038818-04:00","latency":31569093,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038819-04:00","latency":34819759,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038881-04:00","latency":29341818,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038882-04:00","latency":27351777,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.038882-04:00","latency":34962368,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.040551-04:00","latency":31813279,"error":"rpc error: code = PermissionDenied desc = Permission denied.","status":"PermissionDenied"},{"timestamp":"2019-01-23T20:08:58.040631-04:00","latency":31451615,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.041407-04:00","latency":26648449,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.041762-04:00","latency":27919851,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.043675-04:00","latency":38730805,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.043675-04:00","latency":29792375,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.043676-04:00","latency":39699855,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.043731-04:00","latency":28119759,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.043733-04:00","latency":32490180,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.045658-04:00","latency":33308933,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.045825-04:00","latency":36417269,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.045826-04:00","latency":32019172,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.045826-04:00","latency":36329406,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.045903-04:00","latency":39056869,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.049408-04:00","latency":44508736,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.049408-04:00","latency":38312086,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.049409-04:00","latency":45499216,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.050983-04:00","latency":41764886,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.050984-04:00","latency":37147201,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.052226-04:00","latency":40992048,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.052227-04:00","latency":37449313,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.053674-04:00","latency":44859352,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.053871-04:00","latency":42306488,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.056243-04:00","latency":42342973,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.056529-04:00","latency":44385744,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.056573-04:00","latency":42728933,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.059307-04:00","latency":44527910,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.059307-04:00","latency":44581873,"error":"rpc error: code = Internal desc = Internal error.","status":"Internal"},{"timestamp":"2019-01-23T20:08:58.065261-04:00","latency":28453969,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.065262-04:00","latency":28231763,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.065263-04:00","latency":28242591,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.065422-04:00","latency":26558538,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.06674-04:00","latency":27783181,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.067805-04:00","latency":28941288,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.067806-04:00","latency":31121372,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.067829-04:00","latency":31047262,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.067863-04:00","latency":31140476,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.068262-04:00","latency":31415318,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.071729-04:00","latency":31002779,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.07173-04:00","latency":32739905,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.07173-04:00","latency":35049443,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.07173-04:00","latency":34791453,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.071771-04:00","latency":32816227,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.072163-04:00","latency":63426403,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.072393-04:00","latency":26440928,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.073156-04:00","latency":29469301,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.075441-04:00","latency":38502760,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.075706-04:00","latency":31894726,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.075707-04:00","latency":38811063,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.075934-04:00","latency":26382845,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.075962-04:00","latency":35361573,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.077402-04:00","latency":40674739,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.078599-04:00","latency":36733003,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.079262-04:00","latency":40317195,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.079309-04:00","latency":33470939,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.079763-04:00","latency":38302205,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.080141-04:00","latency":36362331,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.080537-04:00","latency":41295032,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.080537-04:00","latency":43658378,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.08111-04:00","latency":37327635,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.081111-04:00","latency":27368428,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.082462-04:00","latency":25886425,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.08547-04:00","latency":41650464,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.085471-04:00","latency":39569657,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.088869-04:00","latency":42842625,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.088871-04:00","latency":36530311,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.090921-04:00","latency":31517636,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.090939-04:00","latency":34055750,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.091131-04:00","latency":41593855,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.093662-04:00","latency":28156471,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.093663-04:00","latency":44102332,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.093664-04:00","latency":42595700,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.094201-04:00","latency":28615094,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.095146-04:00","latency":42827271,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.095702-04:00","latency":44614287,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.095917-04:00","latency":36545673,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.099561-04:00","latency":43195390,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.099832-04:00","latency":31940598,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.100298-04:00","latency":28381673,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.101065-04:00","latency":32663561,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.101067-04:00","latency":35567797,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.102988-04:00","latency":35012703,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.10299-04:00","latency":27208154,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.103363-04:00","latency":66670117,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.103364-04:00","latency":31534714,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.105636-04:00","latency":38837731,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.105637-04:00","latency":27000687,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.110653-04:00","latency":29486250,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.110673-04:00","latency":31278583,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.110714-04:00","latency":42683052,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.110716-04:00","latency":38923528,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.111012-04:00","latency":38724037,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.111385-04:00","latency":43423084,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.113735-04:00","latency":48310513,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.113772-04:00","latency":37779222,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.113799-04:00","latency":67868345,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.114513-04:00","latency":42672036,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.114793-04:00","latency":42360390,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.115796-04:00","latency":42597089,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.115921-04:00","latency":36562472,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.115962-04:00","latency":40456988,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.115999-04:00","latency":62068838,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.116-04:00","latency":30481475,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.116041-04:00","latency":33498963,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.116042-04:00","latency":38606020,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.11618-04:00","latency":40424334,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.116274-04:00","latency":44476243,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.119601-04:00","latency":25882936,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.119619-04:00","latency":38441283,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.11962-04:00","latency":43622520,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.119636-04:00","latency":34105794,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.119682-04:00","latency":39856291,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.119748-04:00","latency":28543954,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.126846-04:00","latency":32965744,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.126893-04:00","latency":37983295,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.126895-04:00","latency":38003456,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.126895-04:00","latency":31043381,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.126896-04:00","latency":26351271,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.129295-04:00","latency":38265676,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.129296-04:00","latency":34033605,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.129614-04:00","latency":35912450,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.129661-04:00","latency":33673199,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.131861-04:00","latency":32237244,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.133843-04:00","latency":29663444,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.13672-04:00","latency":36778078,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.140569-04:00","latency":36500667,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.144833-04:00","latency":64239366,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.144845-04:00","latency":33756336,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.144877-04:00","latency":43758558,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.145797-04:00","latency":42691382,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.149272-04:00","latency":69046654,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.149279-04:00","latency":38445378,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.15355-04:00","latency":37446918,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.159524-04:00","latency":45551024,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.174553-04:00","latency":58436375,"error":"","status":"OK"},{"timestamp":"2019-01-23T20:08:58.184558-04:00","latency":43858389,"error":"","status":"OK"}];

	const data = [
		
			{ name: '25.88 ms', value: 1 },
		
			{ name: '30.20 ms', value: 27 },
		
			{ name: '34.52 ms', value: 50 },
		
			{ name: '38.83 ms', value: 46 },
		
			{ name: '43.15 ms', value: 41 },
		
			{ name: '47.46 ms', value: 16 },
		
			{ name: '51.78 ms', value: 1 },
		
			{ name: '56.10 ms', value: 0 },
		
			{ name: '60.41 ms', value: 1 },
		
			{ name: '64.73 ms', value: 11 },
		
			{ name: '69.05 ms', value: 4 },
		
	];

	function createHorizontalBarChart() {
		let barChart = britecharts.bar(),
			tooltip = britecharts.miniTooltip(),
			barContainer = d3.select('.js-bar-container'),
			containerWidth = barContainer.node() ? barContainer.node().getBoundingClientRect().width : false,
			tooltipContainer,
			dataset;

		if (containerWidth) {
			dataset = data;
			barChart
				.isHorizontal(true)
				.isAnimated(true)
				.margin({
					left: 100,
					right: 20,
					top: 20,
					bottom: 20
				})
				.colorSchema(britecharts.colors.colorSchemas.teal)
				.width(containerWidth)
				.yAxisPaddingBetweenChart(20)
				.height(400)
				// .hasPercentage(true)
				.enableLabels(true)
				.labelsNumberFormat('')
				.percentageAxisToMaxRatio(1.3)
				.on('customMouseOver', tooltip.show)
				.on('customMouseMove', tooltip.update)
				.on('customMouseOut', tooltip.hide);

			barChart.orderingFunction(function(a, b) {
				var nA = a.name.replace(/ms/gi, '');
				var nB = b.name.replace(/ms/gi, '');

				var vA = Number.parseFloat(nA);
				var vB = Number.parseFloat(nB);

				return vB - vA;
			})

			barContainer.datum(dataset).call(barChart);

			tooltipContainer = d3.select('.js-bar-container .bar-chart .metadata-group');
			tooltipContainer.datum([]).call(tooltip);
		}
	}

	function setJSONDownloadLink () {
		var filename = "data.json";
		var btn = document.getElementById('dlJSON');
		var jsonData = JSON.stringify(rawData)
		var blob = new Blob([jsonData], { type: 'text/json;charset=utf-8;' });
		var url = URL.createObjectURL(blob);
		btn.setAttribute("href", url);
		btn.setAttribute("download", filename);
	}

	function setCSVDownloadLink () {
		var filename = "data.csv";
		var btn = document.getElementById('dlCSV');
		var csv = Papa.unparse(rawData)
		var blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
		var url = URL.createObjectURL(blob);
		btn.setAttribute("href", url);
		btn.setAttribute("download", filename);
	}

	createHorizontalBarChart();

	setJSONDownloadLink();

	setCSVDownloadLink();
	
	</script>

	<script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
	
</html>
